<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>message组件示例:</title>

<!--一个基于flexbox的布局类库-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.5.1/css/bulma.css">


<style type="text/css">


  body {

    padding-top: 40px;

  }

  .messageDiv {

    padding-left: 40px;
    padding-right: 40px;
  }


</style>

</head>


<body>





<div id="root" class="messageDiv">
  <message title="提示1" body="该主题已被禁止评论"></message>

  <message title="提示2" body="该主题已被禁止评论"></message>

  <message title="提示3" body="该主题已被禁止评论"></message>
</div>





<!-- vue -->
<!-- <script src="https://unpkg.com/vue@2.4.2"></script> -->
<script src="./js/vue2.4.2.js"></script>

<!--
    引入组件
  -->
<script src="./exerciseJS/component_message.js" >  </script>


  </body>
</html>
